<div class="layui-card">
    <div class="layui-card-header">
        <h2 class="header-title">企业部门</h2>
        <span class="layui-breadcrumb pull-right">
          <a href="#!console">首页</a>
          <a><cite>企业部门</cite></a>
        </span>
    </div>
    <div class="fsh-rightPanel" >
        <div class="layui-anim layui-anim-upbit">
            <div class="layui-btn-group" style="margin: 20px 0 0 20px;">
<!--                <button class="layui-btn" id="btn-expand">全部展开</button>-->
<!--                <button class="layui-btn" id="btn-fold">全部折叠</button>-->
                <button class="layui-btn btn-primary" id="ent_add">新建企业</button>
                <!--                <button class="layui-btn btn-primary" id="flushPerCache">刷新缓存</button>-->
            </div>
        </div>
    </div>
    <div class="layui-card-body">
        <!-- 数据表格 -->
        <table class="layui-table" id="ent-table" lay-filter="ent-table"></table>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="ent-table-bar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
<!--    <a class="layui-btn layui-btn-xs"lay-event="add">添加下级</a>-->
</script>

<!-- 表单弹窗 -->
<script type="text/html" id="ent-model">
    <form id="ent_form" lay-filter="ent_form" class="layui-form model-form">
        <input name="ent_id" type="hidden"/>
        <input name="pid" type="hidden"/>
        <input name="top_pid" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-block">
                <input name="name" placeholder="请输入企业名称" type="text" class="layui-input"
                       lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">管理员账号</label>
            <div class="layui-input-block">
                <input name="username" placeholder="请输入账号" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">管理员密码</label>
            <div class="layui-input-block">
                <input name="mima" placeholder="请输入密码" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-block">
                <input name="des" placeholder="请输入描述" type="text" class="layui-input"  />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-block">
                <input name="address" placeholder="请输入地址" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">人数</label>
            <div class="layui-input-block">
                <input name="peopleNum" placeholder="请输入注册人数" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">邮箱</label>
            <div class="layui-input-block">
                <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">电话</label>
            <div class="layui-input-block">
                <input name="tel1" placeholder="请输入电话" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <input name="remark" placeholder="请输入备注" type="text" class="layui-input" />
            </div>
        </div>
        <div class="layui-form-item model-form-footer">
            <button class="layui-btn layui-btn-primary" ew-event="closeDialog" type="button">取消</button>
            <button class="layui-btn" lay-filter="ent-form-submit" lay-submit>保存</button>
        </div>
    </form>
</script>


<script>
    layui.use(['form', 'table', 'treetable','util', 'config', 'admin'], function () {
        var $ = layui.jquery;
        var table = layui.table;
        var treetable = layui.treetable;
        var config = layui.config;
        var form = layui.form;
        var util = layui.util;
        var admin = layui.admin;
        var apiPre = "api-sys/api/enterprise/";

        // 渲染表格
        layer.load(2);
        var entTable = table.render({
            page: true,
            treeColIndex: 0,//树形图标显显示在第几列
            treeSpid: 0,//顶级pid
            treeIdName: 'ent_id',//id
            treePidName: 'pid',//pid
            elem: '#ent-table',//要渲染的表格数据
            url: config.base_server + apiPre + 'list',
            where: {
                access_token: config.getToken().access_token
            },
            treeDefaultClose: true,//不全部展开
            // treeLinkage: true,        // 父级展开时是否自动展开所有子级
            cols: [[
                {field: 'name', sort: true, title: '名称'},
                {field: 'peopleNum', sort: true, title: '注册人数'},
                {field: 'address', sort: true, title: '地址'},
                {field: 'email', sort: true, title: '邮箱'},
                {field: 'des', sort: true, title: '描述'},
                {field: 'remark', sort: true, title: '备注'},
                {field: 'createDate', sort: true,  title: '创建时间'},
                {align: 'center', toolbar: '#ent-table-bar', title: '操作',width: 250}
            ]],
            done: function () {
                layer.closeAll('loading');
            }
        });

        // 新建
        $("#ent_add").click(function () {
            var subData = {
                addSub: true,
                pid : 0,
                top_pid : 0
            };
            showEditModel(subData);

        });
        // 工具条点击事件
        table.on('tool(ent-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;
            if (layEvent === 'edit') { // 修改
                showEditModel(data);
            } else if (layEvent === 'del') { // 删除
                doDelete(obj);
            }
        });

        // 删除
        var doDelete = function (obj) {
            layer.confirm('确定要删除吗？', function (i) {
                layer.close(i);
                layer.load(2);
                admin.req(apiPre + 'del/' + obj.data.ent_id, {}, function (data) {
                    layer.closeAll('loading');
                    if (data.code == 0) {
                        layer.msg(data.msg, {icon: 1, time: 500});
                        obj.del();
                    } else {
                        layer.msg(data.msg, {icon: 2, time: 500});
                    }
                }, 'DELETE');
            });
        };

        // 显示编辑弹窗
        var showEditModel = function (data) {
            layer.open({
                type: 1,
                title: data ? '修改' : '添加',
                area: '450px',
                offset: '120px',
                content: $('#ent-model').html(),
                success: function () {
                    $('#ent_form')[0].reset();
                    $('#ent_form').attr('method', 'POST');
                    if (data) {
                        // $("input[name='parent_key']").attr('disabled',true);
                        // $("input[name='parent_keys']").attr('disabled',true);
                        form.val('ent_form', data);
                        $('#ent_form').attr('method', 'POST');
                    }
                }
            });
        };

        // 表单提交事件
        form.on('submit(ent-form-submit)', function (data) {
            layer.load(2);
            if (data.field.ent_id){
                admin.req(apiPre + 'update', JSON.stringify(data.field), function (data) {
                    layer.closeAll('loading');
                    console.log(data);
                    if (data.code == 0) {
                        table.reload('ent-table');
                        layer.closeAll('page');
                        layer.msg(data.msg, {icon: 1, time: 500});
                    } else {
                        layer.msg(data.msg, {icon: 2, time: 500});
                    }
                }, 'PATCH');
            }else{
                admin.req(apiPre + 'add', JSON.stringify(data.field), function (data) {
                    layer.closeAll('loading');
                    // console.log(data);
                    // debugger
                    if (data.code == 0) {
                        table.reload('ent-table');
                        layer.closeAll('page');
                        layer.msg(data.msg, {icon: 1, time: 500});
                    } else {
                        layer.msg(data.msg, {icon: 2, time: 500});
                    }
                }, 'POST');
            }
            return false;
        });
    });

</script>
